.chk,
.tree-node-chk,
.list-group-chk,
.list-item-chk {
  display: inline-block;
  line-height: @baseLineHeight;
  color: @textColor;
  text-decoration: none;

  i {
    display: inline-block;
    width: @baseIconSize;
    height: @baseIconSize;
    vertical-align: top;
    background-image: url(../img/icons.png);
    background-repeat: no-repeat;
    background-position: (0px - (30px * 0) - (30px - @baseIconSize) / 2 - 2px) (0px - (30px * 5) - (30px - @baseIconSize) / 2);
  }

  &:hover i {
    background-position: (0px - (30px * 1) - (30px - @baseIconSize) / 2 - 2px) (0px - (30px * 5) - (30px - @baseIconSize) / 2);
  }

  span {
    display: inline-block;
    height: @baseLineHeight;
    padding-right: 10px;
  }
}

.list-group-checked .list-group-chk,
.list-item-checked .list-item-chk,
.tree-node-checked .tree-node-chk,
.chk-checked {
  i {
    background-position: (0px - (30px * 3) - (30px - @baseIconSize) / 2 - 2px) (0px - (30px * 5) - (30px - @baseIconSize) / 2);
  }

  &:hover i {
    background-position: (0px - (30px * 4) - (30px - @baseIconSize) / 2 - 2px) (0px - (30px * 5) - (30px - @baseIconSize) / 2);
  }
}

.list-group-disabled .list-group-chk,
.list-item-disabled .list-item-chk,
.chk-disabled {
  cursor: default;
  color: @inactiveTextColor;

  i {
    background-position: (0px - (30px * 2) - (30px - @baseIconSize) / 2 - 2px) (0px - (30px * 5) - (30px - @baseIconSize) / 2);
  }

  &:hover i {
    background-position: (0px - (30px * 2) - (30px - @baseIconSize) / 2 - 2px) (0px - (30px * 5) - (30px - @baseIconSize) / 2);
  }
}

.chk-disabled.chk-checked {
  color: @inactiveTextColor;

  i {
    background-position: (0px - (30px * 5) - (30px - @baseIconSize) / 2 - 2px) (0px - (30px * 5) - (30px - @baseIconSize) / 2);
  }

  &:hover i {
    background-position: (0px - (30px * 5) - (30px - @baseIconSize) / 2 - 2px) (0px - (30px * 5) - (30px - @baseIconSize) / 2);
  }
}

.chk-list {
  .chk {
    display: block;
  }
}

.chk-list-inline {
  .chk {
    display: inline-block;
  }
}
